iOS Core Animation - Advanced Techniques-学习笔记（一）

发表于 | 更新于

本文是针对《iOS Core Animation: Advanced Techniques》相对重要知识点进行的总结笔记，插图和具体释义请参照原书

图层树

深刻理解图层与视图

  • 视图（UIView）是在屏幕上显示的，能够拦截用户行为（如手势输入）的矩形块，视图具有层级关系并可互相嵌套。
  • 图层（CALayer）和视图（UIView）在概念上类似，和视图最大的不同，是图层不处理用户行为。
  • 在iOS和MacOS两个平台上，事件和用户交互有很多不同，UIKit和AppKit就是基于CoreAnimation针对两个平台的不同处理框架。

为什么要使用图层

  • UIView的接口优美而简洁，但这种简单会造成灵活性上的缺陷。
  • UIView没有暴露出的CALayer一些功能：
    • 阴影，圆角，带颜色的边框
    • 3D变换
    • 非矩形范围
    • 透明遮罩
    • 多级非线性动画

如何使用图层

  • UIView视图类带有一个CALayer属性可直接使用
  • 把QuartzCore引入到项目，然后调用CALayer初始化方法创建
1
2
3
4
5
6
7
8
9
10
11
ViewController.m

- (void)viewDidLoad{
    [super viewDidLoad];
    //create sublayer
    CALayer *sublayer = [CALayer layer];
    sublayer.frame = CGRectMake(50.0f, 50.0f, 100.0f, 100.0f);
    sublayer.backgroundColor = [UIColor blueColor].CGColor;
    //add it to view
    [self.view.layer addSublayer:sublayer];
}

寄宿图

contents属性

  • CALayer有一个属性contents，它是id类型的，在iOS平台上需要被赋值的类型是CGImageRef，一个指向CGImage结构的指针。在Mac平台上需要被赋值NSImage对象
  • contents属性能够让图层不仅展示一个背景色，可以展示一个图片
1
2
3
4
5
6
7
8
9
10
ViewController.m

- (void)viewDidLoad
{
  [super viewDidLoad]; //load an image
  UIImage *image = [UIImage imageNamed:@"xxx.png"];

  //add it directly to our view's layer
  self.layerView.layer.contents = (__bridge id)image.CGImage;
}

contentGravity属性

  • 类似于UIImageView的contentMode，在CALayer中对应的属性叫做contentsGravity，它是一个NSString类型，可选常量：
    • kCAGravityCenter 水平垂直居中
    • kCAGravityTop 水平居中，顶部边缘为0
    • kCAGravityBottom 水平居中，底部边缘为0
    • kCAGravityLeft 垂直居中，左部边缘为0
    • kCAGravityRight 垂直居中，右部边缘为0
    • kCAGravityTopLeft 左上边缘为0
    • kCAGravityTopRight 右上边缘为0
    • kCAGravityBottomLeft 左下边缘为0
    • kCAGravityBottomRight 右下边缘为0
    • kCAGravityResize 根据图层大小拉伸
    • kCAGravityResizeAspect 整个图片等比渲染全部展示到图层，可能会有留白
    • kCAGravityResizeAspectFill 整个图片等比渲染铺满图层，图片可能被截断

contentsScale属性

  • contentsScale属性定义了寄宿图的像素尺寸和视图大小的比例，默认情况下它是一个值为1.0的浮点数。
  • 这个属性在开发中没有找到具体的应用场景，不建议直接使用

maskToBounds属性

  • 将超出图层边界的内容截断
  • 【注意】设置阴影也会被这个属性截断，因为阴影是绘制在图层外的

contentsRect属性

  • 这个属性允许我们选择寄宿图的一个子域，这个属性比contentGravity更灵活
  • 和bounds，frame不同，contentsRect不是按点来计算的，它使用了单位坐标，单位坐标指定在0到1之间，是一个相对值（像素和点就是绝对值）
  • 默认的contentsRect是{0, 0, 1, 1}，意味着整个图片可见
  • 通过这个属性，我们可以实现Image Sprites（图片拼合技术），图片拼合后可以打包整合到一张大图上一次性载入。相比多次载入不同的图片，这样做能够带来很多方面的好处：内存使用，载入时间，渲染性能等等。
  • 图片拼合技术在游戏中应用较多，如一段连续的奔跑动画🏃

contentsCenter属性

  • contentsCenter是一个CGRect结构，它定义了一个固定的边框和一个在图层上可拉伸的区域。
  • 它的工作效果和UIImage里的-resizableImageWithCapInsets:方法效果非常类似
  • 在开发中目前还没有实际运用到它，应用后更新使用场景

视图-drawRect:方法

  • 设置寄宿图的方法，不止有给contents属性赋值这种方式，还能够通过继承UIView并实现-drawRect:方法来自定义绘制
  • 寄宿图不是必须的，但是只要UIView检测到-drawRect:，那么系统就会为这个视图图层分配一个寄宿图，该寄宿图的尺寸等于视图大小乘以 contentsScale的值
  • 如果不需要寄宿图，-drawRect:请不要实现，会浪费资源